<!DOCTYPE html>
<html lang="en" ng-app="clientApp">
<head>
    <meta charset="UTF-8">

    <!-- import css -->
    <link href="/client_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="/client_modules/bootstrap/dist/css/bootstrap-theme.css" rel="stylesheet">
    <link href="/client_modules/angular-bootstrap/ui-bootstrap-csp.css" rel="stylesheet">
    <link href="/css/cart-styles.css" rel="stylesheet">
    <link href="/css/font-awesome.min.css" rel="stylesheet">
    <link href="/css/grade-style.css" rel="stylesheet">
    <link href="/css/index.css" rel="stylesheet">
    <link href="/css/menu-style.css" rel="stylesheet">
    <link href="/css/stars.css" rel="stylesheet">
    <link href="/css/style.css" rel="stylesheet">

    <!-- import scripts -->
    <script src="/client_modules/jquery/dist/jquery.min.js"></script>
    <script src="/client_modules/angular/angular.js"></script>
    <script src="/client_modules/angular-animate/angular-animate.min.js"></script>
    <script src="/client_modules/angular-route/angular-route.js"></script>
    <script src="/client_modules/angular-bootstrap/ui-bootstrap.js"></script>
    <script src="/client_modules/angular-bootstrap/ui-bootstrap-tpls.js"></script>
    <script src="/client_modules/socket.io/socket.io.js"></script>

    <!-- import modules -->
    <script src="../config/core.client.router.js"></script>
    <script src="/controllers/appController.js"></script>
    <script src="/services/appService.js"></script>
    <script src="/user/controllers/user.client.controller.js"></script>
    <!--<script src="/cart/controllers/cart.client.controller.js"></script>-->
    <!--<script src="/order/controllers/order.client.controller.js"></script>-->
    <!--<script src="/order/controllers/receive.client.controller.js"></script>-->
    <script src="/order/controllers/order.history.client.controller.js"></script>
    <script src="/order/controllers/order.waitAndRecieveOrder.client.controller.js"></script>
    <script src="/order/controllers/order.checkout.client.controller.js"></script>
    <script src="/user/controllers/user.client.controller.js"></script>
    <script src="/merchant/controllers/dish.client.controller.js"></script>
    <script src="/merchant/controllers/merchant.client.controller.js"></script>

    <title>index</title>
</head>
<body ng-controller="indexController">
<div class="contain">
    <div class="header">
        <ul class="header-title">
            <li>
                <div>
                    <img style="margin-top: -15px;" src="/images/logo.png"
                         class="logo"><a style="font-size: 35px;"
                                         href="#/merchant">Just Eat</a>
                </div>
            </li>
            <!--<li><a href="${pageContext.request.contextPath }/index">Merchant</a></li>-->
            <!--<li><a-->
            <!--href="${pageContext.request.contextPath }/waitingForReceiving">Order</a></li>-->
            <!--<li><a-->
            <!--href="${pageContext.request.contextPath }/historicalOrders">history-->
            <!--Order</a></li> -->
        </ul>
        <ul ng-show="user != null" class="after-login">
            <li><a style="font-size: 12px;"
                 href="javascript:void(0)" ng-click="logout()">Logout</a></li>
            <li style="margin-top: 0px;"><span>Welcome!</span><a style="font-size: 25px;"
                                                                 href="#/user" ng-bind="user.cname"></a>
            </li>
        </ul>
        <ul ng-show="user == null" class="header-sidebar">
            <li style="margin-top: 0px;">
                <div>
                    <a href="{{constant.baseUrl}}login.html">Register</a>
                </div>
            </li>
            <li style="margin-top: 0px;">
                <div>
                    <a href="{{constant.baseUrl}}login.html">Login</a>
                </div>
            </li>
        </ul>
    </div>

    <!--   图片轮换-->
    <div ng-show="showCom" id="demo">
        <div id="indemo">
            <div id="demo1">
                <a ng-repeat="dish in dishes" href="#/merchant/{{dish.merchant._id}}">
                    <p>
                        <img ng-src="{{constant.imgServer}}{{dish.img}}" alt=""/>
                    </p>
                </a>
                <!--</c:forEach>-->
            </div>
            <div id="demo2"></div>
        </div>
    </div>
    <div class='menu'>
        <div class='menu-wrapper'>
            <ul class='menu-items'>
                <!-- ä¸»é¡µ -->
                <li class='menu-item'>

                    <button class='menu-item-button'>
                        <a href="#/merchant" title="merchant"> <i class='fa fa-home menu-icon'></i></a>
                    </button>
                    <div class='menu-item-bounce'></div>
                </li>
                <!-- æªå®æè®¢å -->
                <li class='menu-item'>
                    <button class='menu-item-button'>
                        <a href="#/order/waitAndRecieve" title="wait for receiving"> <i class='fa fa-hourglass-half menu-icon'></i>
                        </a></button>
                    <div class='menu-item-bounce'></div>
                </li>
                <li class='menu-item'>
                    <!-- åå²è®¢å -->
                    <button class='menu-item-button'>
                        <a href="#/order/history" title="history order"> <i class='fa fa-newspaper-o menu-icon'></i>
                        </a></button>
                    <div class='menu-item-bounce'></div>
                </li>
                <li ng-if="user != null" class='menu-item'>
                    <button class='menu-item-button'>
                        <a href="#/user" title="personal Information"> <i class='fa fa-user menu-icon'></i>
                        </a></button>
                    <div class='menu-item-bounce'></div>
                </li>
            </ul>
            <button class='menu-toggle-button'>
                <i class='fa fa-list menu-toggle-icon'></i>
            </button>
        </div>
    </div>
    <div class="container ">
        <div ng-view></div>
    </div>
    <!--container end-->
</div>
<!--contain end-->
<div class="footer container">
    <hr/>
    <div>
        本网站由大腿组开发，若发现您的消费利益被侵害，请联系datuizu@163.com ，我们尽快处理。
        <p>©2016 大腿组.保留所有权利。</p>
    </div>
</div>
<!--footer end-->


<script src="/client_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src='/js/TweenMax.min.js'></script>
<script src="/js/menu-script.js"></script>
<script src="/cart/views/js/jquery-ui.min.js"></script>
<script src="/cart/views/js/cart.js"></script>
<script>
    window.onload = function () {

        setTimeout(function () {
            huandeng();
//            console.log('dddd')
        }, 300)
    };

    function huandeng() {

        var speed = 20; //数字越大速度越慢
        var tab = document.getElementById("demo");
        var tab1 = document.getElementById("demo1");
        var tab2 = document.getElementById("demo2");
        tab2.innerHTML = tab1.innerHTML;
        // console.log(tab.scrollLeft)
        function Marquee() {
            if (tab2.offsetWidth - tab.scrollLeft <= 0)
                tab.scrollLeft -= tab1.offsetWidth
            else {
                tab.scrollLeft++;
            }
        }

        var MyMar = setInterval(Marquee, speed);
        tab.onmouseover = function () {
            clearInterval(MyMar)
        };
        tab.onmouseout = function () {
            MyMar = setInterval(Marquee, speed)
        };
    }
</script>

</body>
</html>